<template>
	<view class="page-fill">
		<form @submit="submit">
			<input 
				type="text" 
				:value="user.nickname" 
				name='nickname'
				placeholder="输入新的昵称"
				maxlength="10"
				class='input'/>
			<button type="primary" form-type="submit" class="submitBtn">确定</button>
		</form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user: {}
			}
		},
		
		onLoad() {
			this.user = this.getGlobalUser();
		},
		
		onShow() {
			this.user = this.getGlobalUser();
		},
		
		methods: {
			getGlobalUser() {
				return uni.getStorageSync(this.globalUser);
			},
			setGlobalUser(user) {
				uni.setStorageSync(this.globalUser, this.user);
			},
			submit(e) {
				// debugger;
				const nickname = e.detail.value.nickname;
				console.log(nickname);
				console.log(this.user.token);
				
				uni.request({
					url: this.baseUrl + '/api/edu/user/reset-nickname', 
					method: 'POST',
					data: {
						id: this.user.id,
						token: this.user.token,
						nickname: nickname
					},
					success: (res) => {
						if (res.data.code == 200) {
							this.user.nickname = nickname;
							this.setGlobalUser(this.user);
							uni.navigateTo({
								url:'user-info'
							})
						}
						else {
							uni.showToast({
								title:'更新失败',
								duration:1000,
							})
						}
					}
				})
			}
		}
	}
</script>

<style>
/* 页面铺满屏幕 */
.page-fill {
	width:100%;
	height: 100%;
	position: absolute;
}

.graywords {
	color: #EAEAEA;
}

.input {
	height: 80upx;
	line-height: 80upx;
	width: 500upx;
	margin-left: 40upx;
}

.submitBtn {
	width: 95%;
	margin-top: 40upx;
}
</style>
